import { Component, OnInit } from '@angular/core';
import { select, Store } from '@ngrx/store';
import { AppMainComponent } from './app.main.component';
import { UtilsService } from './service/utils.service';
import { AppState } from './store/app.model';
import { getMenu } from './store/user/user.reducer';

@Component({
    selector: 'app-menu',
    template: `
        <div class="layout-menu-container" style="overflow:hidden">
            <ul
                class="layout-menu"
                role="menu"
                (keydown)="onKeydown($event)"
                style="overflow:auto;"
            >
                <li
                    app-menu
                    class="layout-menuitem-category"
                    *ngFor="let item of model; let i = index"
                    [item]="item"
                    [index]="i"
                    [root]="true"
                    role="none"
                >
                    <div
                        class="layout-menuitem-root-text"
                        [attr.aria-label]="item.label"
                    >
                        {{ item.label }}
                    </div>
                    <ul role="menu" style="display: block;">
                        <li
                            app-menuitem
                            *ngFor="let child of item.items"
                            [item]="child"
                            [index]="i"
                            role="none"
                        ></li>
                    </ul>
                </li>
            </ul>
        </div>
    `,
})
export class AppMenuComponent implements OnInit {
    model: any[];
    menuData: any[];
    constructor(
        public appMain: AppMainComponent,
        public store: Store<AppState>,
        public utilsService: UtilsService
    ) {
        this.store.pipe(select(getMenu)).subscribe((data) => {
            this.menuData = data;
            console.log(this.menuData);
        });
    }

    ngOnInit() {
        this.model = [
            {
                items: [
                    {
                        label: '首页',
                        icon: 'pi pi-fw pi-home',
                        routerLink: ['/'],
                        used: false,
                    },
                ],
            },
            {
                label: '阀栓管理',
                items: [
                    {
                        label: '阀门信息',
                        icon: 'pi pi-fw pi-id-card',
                        routerLink: ['pages/basicinfo'],
                        used: false,
                    },
                    {
                        label: '消防栓信息',
                        icon: 'pi pi-fw pi-check-square',
                        routerLink: ['pages/hydrantbasicinfo'],
                        used: false,
                    },
                    {
                        label: '配额管理',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/quota'],
                        used: false,
                    },
                    {
                        label: '用水统计',
                        icon: 'pi pi-fw pi-exclamation-circle',
                        routerLink: ['pages/statistic'],
                        used: false,
                    },
                    {
                        label: '一张图',
                        icon: 'pi pi-fw pi-mobile',
                        routerLink: ['pages/visualization'],
                        class: 'rotated-icon',
                        used: false,
                    },
                    {
                        label: '监管大屏',
                        icon: 'pi pi-fw pi-table',
                        routerLink: ['pages/gobigscreen'],
                        used: false,
                    },
                    {
                        label: '报警管理',
                        icon: 'pi pi-fw pi-list',
                        routerLink: ['pages/alarmMgmt'],
                        used: false,
                    },
                    {
                        label: '统计报表',
                        icon: 'pi pi-fw pi-share-alt',
                        items: [
                            {
                                label: '工业园区',
                                icon: 'pi pi-fw pi-bookmark',
                                routerLink: ['pages/statistic/area'],
                                used: false,
                            },
                            {
                                label: '区',
                                icon: 'pi pi-fw pi-bookmark',
                                routerLink: ['pages/statistic/district'],
                                used: false,
                            },
                            {
                                label: '乡镇',
                                icon: 'pi pi-fw pi-bookmark',
                                routerLink: ['pages/statistic/town'],
                                used: false,
                            },
                            {
                                label: '村庄',
                                icon: 'pi pi-fw pi-bookmark',
                                routerLink: ['pages/statistic/village'],
                                used: false,
                            },
                        ],
                    },
                    {
                        label: '许可证管理',
                        icon: 'pi pi-fw pi-tablet',
                        routerLink: ['pages/licensemanage'],
                        used: false,
                    },
                    {
                        label: '定时任务',
                        icon: 'pi pi-fw pi-clone',
                        routerLink: ['pages/taskmanage'],
                        used: false,
                    },
                    {
                        label: '数据明细',
                        icon: 'pi pi-fw pi-image',
                        routerLink: ['pages/datadetail'],
                        used: false,
                    },
                    {
                        label: '综合统计',
                        icon: 'pi pi-fw pi-bars',
                        routerLink: ['pages/mixreport'],
                        used: false,
                    },
                    /*{label: 'Message', icon: 'pi pi-fw pi-comment', routerLink: ['/uikit/message']},
                    {label: 'File', icon: 'pi pi-fw pi-file', routerLink: ['/uikit/file']},
                    {label: 'Chart', icon: 'pi pi-fw pi-chart-bar', routerLink: ['/uikit/charts']},
                    {label: 'Misc', icon: 'pi pi-fw pi-circle', routerLink: ['/uikit/misc']}**/
                ],
            },
            {
                label: '用水户地址管理',
                items: [
                    {
                        label: '城市',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/address/city'],
                        used: false,
                    },
                    {
                        label: '区',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/address/district'],
                        used: false,
                    },
                    {
                        label: '乡镇',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/address/town'],
                        used: false,
                    },
                    {
                        label: '村庄',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/address/village'],
                        used: false,
                    },
                    {
                        label: '工业园区',
                        icon: 'pi pi-fw pi-bookmark',
                        routerLink: ['pages/address/area'],
                        used: false,
                    },
                ],
            },
            {
                label: '系统管理',
                items: [
                    {
                        label: '用户管理',
                        icon: 'pi pi-fw pi-eye',
                        routerLink: ['pages/manage/account'],
                        used: false,
                    },
                    {
                        label: '岗位管理',
                        icon: 'pi pi-fw pi-globe',
                        routerLink: ['pages/manage/post'],
                        used: false,
                    },
                    {
                        label: '功能管理',
                        icon: 'pi pi-fw pi-tablet',
                        routerLink: ['pages/manage/func'],
                        used: false,
                    },
                    {
                        label: 'API 管理',
                        icon: 'pi pi-fw pi-clone',
                        routerLink: ['pages/manage/api'],
                        used: false,
                    },
                ],
            },
        ];
        this.getRealMenu(this.menuData, this.model);
        console.log(this.model);
        this.model = this.resetMenu(this.model)
        //console.log(this.resetMenu(this.model));
    }
    getRealMenu(list, config) {
        list.forEach((item) => {
            config.forEach((d) => {
                d.items.forEach((c) => {
                    if (c.routerLink) {
                        if (c.routerLink[0] == item.frontendMenuUrl) {
                            c.used = true;
                        }
                    }
                    if (!c.routerLink) {
                        c.items.forEach((element) => {
                            if (element.routerLink[0] == item.frontendMenuUrl) {
                                element.used = true;
                            }
                        });
                    }
                });
            });
        });
    }
    resetMenu(model) {
        let lastdata = [];
        model.forEach((a) => {
            let temp = { items: [], label: null };
            if (a.label) {
                temp.label = a.label;
            }
            if (a.items) {
                a.items.forEach((b) => {
                    if (b.used) {
                        temp.items.push(b);
                    }
                    let temp2 = { label: b.label, icon: b.icon, items: [] };
                    if (!b.used) {
                        if (b.items) {
                            b.items.forEach((c) => {
                                if (c.used) {
                                    temp2.items.push(c);
                                }
                            });
                            temp.items.push(temp2);
                        }
                    }
                });
            }
            if(temp.items.length!=0)lastdata.push(temp);
        });
        return lastdata;
    }
    /**getRealMenu(list, config) {
        let data = [];
        let findExist = (data, label, item) => {
            let o = true;
            data.forEach((element) => {
                if (element.label) {
                    if (element.label == label) {
                        element.items.push(item);
                        o = false;
                        return;
                    }
                }
            });
            if (o) {
                let a = { label: label, items: [] };
                a.items.push(item);
                data.push(a);
            }
        };
        list.forEach((item) => {
            let stop = true;
            config.forEach((d) => {
                d.items.forEach((c) => {
                    if (c.routerLink && stop) {
                        if (
                            c.routerLink[0].indexOf(item.frontendMenuUrl) != -1
                        ) {
                            //console.log(c.routerLink[0], item.frontendMenuUrl);
                            findExist(data, d.label, c);
                            console.log(d, c);
                            console.log(data)
                            stop = false;
                            return;
                        }
                    }
                });
            });
        });
        return data;
    }*/
    onKeydown(event: KeyboardEvent) {
        const nodeElement = <HTMLDivElement>event.target;
        if (event.code === 'Enter' || event.code === 'Space') {
            nodeElement.click();
            event.preventDefault();
        }
    }
}
